<template>
  <el-dialog v-model="dialogVisible" :title="title" width="60%" :before-close="handleClose">
    <!-- <div> -->

    <formPageH ref="formPageHRef" :formList="formData" validCatch="有未填写的数据！" @submitFun="submitFun"
      @closeForm="closeForm" :btnType="true" />
  </el-dialog>
</template>
<script setup>
import {
  getAListOfSpecifiedCustomFields,
  searchForCustomer,
  getAddressOptions
} from "@/plugins/api/customer/setup/fifth";
import { addApi } from "@/plugins/api/customer/manage/opportunity";
import { listApi as dictApi } from "@/plugins/api/system/dict";
import { nextTick } from "vue";
const props = defineProps({
  dataInfo: {
    type: Object,
    default: {},
  },
});
let formPageHRef = ref();
let dialogVisible = ref(false);
function handleClose(done) {
  ElMessageBox.confirm("是否确定关闭此对话框?")
    .then(() => {
      done();
    })
    .catch(() => { });
}

function closeForm() {
  dialogVisible.value = false;
}


const emit = defineEmits(["refreshList"]);
// 获取客户数据
let topTable = ref([]);
let bottomTable = ref([]);
function getList(type) {
  return new Promise((resolve, reject) => {
    getAListOfSpecifiedCustomFields({
      is_sys: type,
      tb_name: "crm_opportunity"
    }).then((data) => {
      if (type == 1) {
        topTable.value = data;
        getTerm(topTable.value);
      } else {
        bottomTable.value = data;
        getTerm(bottomTable.value);
      }

      resolve(data);
    });
  });
}
function getTerm(arr) {
  if (!Array.isArray(arr)) return;
  arr.forEach((item) => {
    if (
      item.form_type == "select" ||
      item.form_type == "radio" ||
      item.form_type == "checkbox"
    ) {
      getDictionary(item.field_id, item.dict_id, arr);
    } else if (item.form_type == "customer") {
      // 搜索客户下拉框
      getDefaultCustomerList(item.field_id, item.dict_id, arr);
    } else if (item.form_type == "region") {
      // 城市选择
      getRegion(item.field_id, item.dict_id, arr);
    }
  });
}
// 获取字典项
function getDictionary(id, dict_id, list) {
  return new Promise((resolve, reject) => {
    dictApi({ dict_id: dict_id }).then((data) => {
      if (list) {
        list.forEach((item) => {
          if (item.field_id == id) {
            item.termList = data.map((ele) => {
              return {
                name: ele.name,
                value: ele.name,
              };
            });
          }
        });
      }
      resolve(data);
    });
  });
}

// 获取省市区选择项树
function getRegion(id, dict_id, list) {
  return new Promise((resolve, reject) => {
    getAddressOptions({}).then((data) => {
      if (list) {
        list.forEach((item) => {
          if (item.field_id == id) {
            item.termList = data;
          }
        });
      }
      resolve(data);
    });
  });
}

function getDefaultCustomerList(id, dict_id, list) {
  return new Promise((resolve, reject) => {
    searchForCustomer({ keyword: '' }).then((data) => {
      if (list) {
        list.forEach((item) => {
          if (item.field_id == id) {
            item.termList = data.map((ele) => {
              return {
                name: ele.name,
                value: ele.id,
              };
            });
          }
        });
      }
      resolve(data);
    });
  });
}


let title = ref("");
let rowId = ref();
function initFun(type, row) {
  dialogVisible.value = true;
  nextTick(() => {
    if (!formPageHRef.value) return;
    if (type == "add") {
      title.value = "新增";
      formPageHRef.value.initFun();
    } else {
      title.value = "编辑";
      rowId.value = row.id;
      formPageHRef.value.updateFun(row);
    }
  })

}

const formData = computed(() => {
  let topArr = topTable.value
    .filter((item) => {
      return item.in_form == 1;
    })
    .map((ele) => {
      let obj = {
        label: ele.name,
        prop: ele.field,
        formType: ele.form_type,
        required: ele.is_null == 1 ? true : false,
        rulesMessage: ele.input_tips || ele.name,
        placeholder: ele.input_tips || ele.name,
        termList: ele.termList,
      };
      if (ele.default_value) {
        obj.default_value = ele.default_value;
      }
      return obj;
    });



  let bottomArr = bottomTable.value
    .filter((item) => {
      return item.in_form == 1;
    })
    .map((ele) => {
      let obj = {
        label: ele.name,
        prop: ele.field,
        formType: ele.form_type,
        required: ele.is_null == 1 ? true : false,
        rulesMessage: ele.input_tips || ele.name,
        placeholder: ele.input_tips || ele.name,
        termList: ele.termList,
      };
      if (ele.default_value) {
        obj.default_value = ele.default_value;
      }
      return obj;
    });


  let allArr = topArr.concat(bottomArr);

  return allArr;
});



function submitFun(obj) {
  let formData = { ...obj, id: rowId.value || undefined }
  addApi(formData).then((data) => {
    ElMessage.success("操作成功！");
    dialogVisible.value = false;
    emit("refreshList");
  });
}
//
onMounted(() => {
  // 获取所有选项
  getList(0);
  getList(1);
});
defineExpose({
  initFun
});
</script>
<style scoped lang="scss">
.tab9-dialog {
  width: 100%;

  :deep(.el-form-item) {
    margin: 10px 0;
  }
}
</style>
